{% extends 'base.html' %}

{% block title %}申请领养 {{ pet.name }}{% endblock %}

{% block content %}
<div class="row justify-content-center">
    <div class="col-md-8">
        <div class="card shadow-sm">
            <div class="card-header bg-primary text-white">
                <h4 class="mb-0">申请领养：{{ pet.name }}</h4>
            </div>
            <div class="card-body">
                <form method="post">
                    {% csrf_token %}
                    <!-- 表单错误提示 -->
                    {% if form.errors %}
                    <div class="alert alert-danger" role="alert">
                        申请提交失败，请检查以下内容：
                        <ul>
                            {% for field in form %}
                                {% for error in field.errors %}
                                    <li>{{ field.label }}: {{ error }}</li>
                                {% endfor %}
                            {% endfor %}
                        </ul>
                    </div>
                    {% endif %}

                    <!-- 申请人信息（只读） -->
                    <div class="mb-3">
                        <label class="form-label">申请人</label>
                        <input type="text" class="form-control" value="{{ user.username }}" readonly>
                    </div>

                    <!-- 联系电话 -->
                    <div class="mb-3">
                        <label for="{{ form.phone.id_for_label }}" class="form-label">{{ form.phone.label }}</label>
                        {{ form.phone }}
                        <div class="form-text">请填写真实手机号，方便工作人员联系</div>
                    </div>

                    <!-- 居住地址 -->
                    <div class="mb-3">
                        <label for="{{ form.address.id_for_label }}" class="form-label">{{ form.address.label }}</label>
                        {{ form.address }}
                        <div class="form-text">请填写详细居住地址，用于确认饲养环境</div>
                    </div>

                    <!-- 领养理由 -->
                    <div class="mb-3">
                        <label for="{{ form.reason.id_for_label }}" class="form-label">{{ form.reason.label }}</label>
                        {{ form.reason }}
                        <div class="form-text">请说明你的饲养条件、时间安排等，帮助我们判断是否适合领养</div>
                    </div>

                    <div class="d-flex justify-content-between">
                        <a href="{% url 'pet_detail' pet.id %}" class="btn btn-secondary">返回详情</a>
                        <button type="submit" class="btn btn-primary">提交申请</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}